/* 材质文本 */
@utility text-primary-vibrant {
  @apply text-primary-vibrant-light;
}
@utility text-secondary-vibrant {
  @apply text-secondary-vibrant-light;
}
@utility text-tertiary-vibrant {
  @apply text-tertiary-vibrant-light;
}
@utility text-quaternary-vibrant {
  @apply text-quaternary-vibrant-light;
}

/* 材质文本浅色 */
@utility text-primary-vibrant-light {
  @apply text-black;
}
@utility text-secondary-vibrant-light {
  @apply bg-clip-text;
  background-image: linear-gradient(0deg, #3d3d3d, #3d3d3d);
  background-color: rgba(127, 127, 127, 0.5);
  background-blend-mode: overlay, luminosity;
}
@utility text-tertiary-vibrant-light {
  @apply bg-clip-text;
  background-image: linear-gradient(
    0deg,
    rgba(61, 61, 61, 0.5),
    rgba(61, 61, 61, 0.5)
  );
  background-color: rgba(127, 127, 127, 0.4);
  background-blend-mode: overlay, luminosity;
}
@utility text-quaternary-vibrant-light {
  @apply bg-clip-text;
  background-image: linear-gradient(
    0deg,
    rgba(61, 61, 61, 0.5),
    rgba(61, 61, 61, 0.5)
  );
  background-color: rgba(127, 127, 127, 0.2);
  background-blend-mode: overlay, luminosity;
}

/* 材质文本深色 */
@utility text-primary-vibrant-dark {
  @apply text-white;
}
@utility text-secondary-vibrant-dark {
  @apply bg-clip-text;
  background-image: linear-gradient(0deg, #c2c2c2, #c2c2c2);
  background-color: rgba(127, 127, 127, 0.5);
  background-blend-mode: overlay, luminosity;
}
@utility text-tertiary-vibrant-dark {
  @apply bg-clip-text;
  background-image: linear-gradient(
    0deg,
    rgba(194, 194, 194, 0.5),
    rgba(194, 194, 194, 0.5)
  );
  background-color: rgba(127, 127, 127, 0.4);
  background-blend-mode: overlay, luminosity;
}
@utility text-quaternary-vibrant-dark {
  @apply bg-clip-text;
  background-image: linear-gradient(
    0deg,
    rgba(194, 194, 194, 0.5),
    rgba(194, 194, 194, 0.5)
  );
  background-color: rgba(127, 127, 127, 0.2);
  background-blend-mode: overlay, luminosity;
}
